Component({
	relations: {
		'../../c-sidebar/index': {
			type: 'ancestor',
			linked(target) {
				this.parent = target;
			},
		},
	},

	externalClasses: ['custom-class'],
	properties: {
		title: String,
		disabled: Boolean,
	},

	data: {
		topRightRadius: false,
		bottomRightRadius: false,
	},

	methods: {
		setActive(selected) {
			console.log(selected);
			setTimeout(() => {
				return this.setData({
					selected
				});
			}, 180)

		},
		onClick() {
			const {
				parent
			} = this;

			if (!parent || this.properties.disabled) {
				return;
			}

			const index = parent.children.indexOf(this);

			parent.setActive(index).then(() => {
				this.triggerEvent('click', index);
				parent.triggerEvent('change', {
					index
				});
			});
		},
		setTopRightRadius(val) {
			return this.setData({
				topRightRadius: val,
			});
		},
		setBottomRightRadius(val) {
			return this.setData({
				bottomRightRadius: val,
			});
		},
	},
});